import React from 'react';
class Layout extends React.Component{
    render(){
        const {} = this.props;
        return(
            <React.Fragment>
                <p>mouseover 事件:不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。</p>
                <p>mouseenter 事件:只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。</p>
                <div className="over">
                    <h2>被触发的 Mouseover 事件次数：<span></span></h2>
                </div>
                <div className="enter">
                    <h2>被触发的 Mouseenter 事件次数：<span></span></h2>
                </div>
                <div className="clear"></div>
                <p className="e-mt50"> mouseout事件：不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。</p>
                <p> mouseleave事件：只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。</p>
                <div className="out">
                    <h2>被触发的 mouseout 事件次数：<span></span></h2>
                </div>
                <div className="leave">
                    <h2>被触发的 mouseleave 事件次数：<span></span></h2>
                </div>
                <div className="clear"></div>
            </React.Fragment>
         )
    }
}
export default Layout;